csznet/tgState

vercel 部署后套cf开cdn页面乱码

Closed this issue · 8 comments

套cf之后页面内容直接成乱码了怎么回事,直接显示源码,标签都没事,文字直接锟斤拷了,就下面这样,cdn一关就好了
`


<title>Telegram鍥惧簥</title>




<style>
#uploadButton,
#uploadFileLabel {
display: block;
max-width: 200px; /* 鍥哄畾瀹藉害 /
margin: 0 auto; /
灞呬腑 /
margin-bottom: 10px; /
娣诲姞搴曢儴闂磋窛 */
}

		body {
			font-family: Arial, sans-serif;
			text-align: center;
		}

		h1 {
			color: #333;
		}

		.custom-file-input {
			display: none;
		}

		.custom-file-label {
			background-color: #007BFF;
			color: #fff;
			padding: 10px 20px;
			cursor: pointer;
		}

		.custom-file-label:hover {
			background-color: #0056b3;
		}

		#uploadButton {
			background-color: #007BFF;
			color: #fff;
			padding: 10px 20px;
			border: none;
			cursor: pointer;
		}

		#uploadButton[disabled] {
			background-color: #ccc;
			cursor: not-allowed;
		}

		#uploadButton:hover {
			background-color: #0056b3;
		}

		#response {
			margin-top: 20px;
			padding: 10px;
		}

		.response-item {
			margin-bottom: 10px;
			padding: 10px;
			border-radius: 5px;
		}

		.response-success {
			background-color: #d4edda;
			border-color: #c3e6cb;
			color: #155724;
		}

		.response-error {
			background-color: #f8d7da;
			border-color: #f5c6cb;
			color: #721c24;
		}

		#loading {
			display: none;
		}
		.copy-code{
			margin: 5px;
		}
		.copy-links{
			margin-top: 5px;
		}
		#uploadButton[disabled]:hover {
	background-color: #ccc;
	cursor: not-allowed;
}

	</style>
	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
	<h1>涓婁紶鍥剧墖鍒� Telegram</h1>
	<label for="uploadFile" id="uploadFileLabel" class="custom-file-label">閫夋嫨鏂囦欢</label>
	<input type="file" name="image" id="uploadFile" accept=".jpg, .jpeg, .png" class="custom-file-input">
	<button id="uploadButton">涓婁紶</button>
	<div id="loading">涓婁紶涓�...</div>
	<div id="response" class="ui-widget">
	</div>

	<script>
// 鐩戝惉绮樿创浜嬩欢
document.addEventListener('paste', function (e) {
	var items = e.clipboardData.items;
	for (var i = 0; i < items.length; i++) {
		var item = items[i];
		if (item.type.indexOf('image') !== -1) {
			// 鑾峰彇绮樿创鐨勫浘鐗囨枃浠�
			var file = item.getAsFile();
			// 璋冪敤涓婁紶鍑芥暟锛屽皢file浼犻€掔粰涓婁紶閫昏緫
			$('#uploadFileLabel').text("宸查€夋嫨鍓创鏉挎枃浠�").css('background-color', '#0056b3');
			uploadImg(file);
		}
	}
});
$(document).ready(function () {
	$('#uploadFile').change(function () {
		var fileName = $(this).val().split('\\').pop();
		if (fileName) {
			$('#uploadFileLabel').text('宸查€夋嫨鏂囦欢: ' + fileName).css('background-color', '#0056b3');
		} else {
			$('#uploadFileLabel').text('閫夋嫨鏂囦欢').css('background-color', '#007BFF');
		}
	});
	$('#uploadButton').click(function () {
		var fileInput = document.getElementById('uploadFile');
		var file = fileInput.files[0];
		if(file){
			uploadImg(file)
		}else{
			alert('璇烽€夋嫨涓€涓浘鐗囨枃浠�');
		}
	});
});
function uploadImg(file){
	var formData = new FormData();
			formData.append('image', file);
			// 绂佺敤涓婁紶鎸夐挳骞舵樉绀簂oading
			$('#uploadButton').prop('disabled', true);
			$('#uploadButton').text('涓婁紶涓�');
			$('#loading').show();
			var baseUrl = window.location.protocol + "//" + window.location.hostname;
			if(window.location.port !== "80" && window.location.port.length>0){
				baseUrl = baseUrl + ":" + window.location.port;
			}
			$.ajax({
				type: 'POST',
				url: baseUrl+'/api',
				data: formData,
				contentType: false,
				processData: false,
				success: function (response) {
					if (response.code === 1) {
						var imgUrl = baseUrl + response.message;
						var newItem = $('<div class="response-item response-success">涓婁紶鎴愬姛锛屽浘鐗囧閾撅細<a target="_blank" href="' + imgUrl + '">' + imgUrl + '</a>' +
							'<div class="copy-links">' +
							'<span class="copy-code" data-clipboard-text="&lt;img src=&quot;' + imgUrl + '&quot; alt=&quot;Your Alt Text&quot;&gt;">HTML</span>' +
							'<span class="copy-code" data-clipboard-text="![Alt Text](' + imgUrl + ')">Markdown</span>' +
							'<span class="copy-code" data-clipboard-text="[img]' + imgUrl + '[/img]">BBCode</span>' +
							'</div></div>');
						$('#response').prepend(newItem); // 灏嗘柊鏁版嵁鏀惧湪鏈€鍓嶉潰

						// 娓呴櫎鏂囦欢杈撳叆妗嗙殑鍊�
						$('#uploadFile').val('');
						$('#uploadFileLabel').text('閫夋嫨鏂囦欢').css('background-color', '#007BFF');

						// 娣诲姞澶嶅埗鍔熻兘
						$('.copy-code').click(function () {
							var textToCopy = $(this).data('clipboard-text');
							var tempInput = $('<input>');
							$('body').append(tempInput);
							tempInput.val(textToCopy).select();
							document.execCommand('copy');
							tempInput.remove();

							// 鏄剧ず澶嶅埗鎴愬姛鏂囨湰
							var copyText = $(this);
							var originalText = copyText.text();
							copyText.text('澶嶅埗鎴愬姛');

							setTimeout(function () {
								copyText.text(originalText);
							}, 1000);
						});
					} else {
						var newItem = $('<div class="response-item response-error">涓婁紶澶辫触,閿欒淇℃伅锛�' + response.message + '</div>');
						$('#response').prepend(newItem); // 灏嗘柊鏁版嵁鏀惧湪鏈€鍓嶉潰
					}
				},
				error: function () {
					var newItem = $('<div class="response-item response-error">涓婁紶澶辫触</div>');
					$('#response').prepend(newItem); // 灏嗘柊鏁版嵁鏀惧湪鏈€鍓嶉潰
				},
				complete: function () {
					// 鍚敤涓婁紶鎸夐挳骞堕殣钘弆oading
					$('#uploadButton').prop('disabled', false);
					$('#uploadButton').text('涓婁紶');
					$('#loading').hide();
				}
			});
}
	</script>
	<a href="https://www.csz.net/"><img src="https://www.csz.net/csznet.png"></a>
</body>
</html>
`
csznet commented

cf的证书设置成Full (strict)试一下

cf的证书设置成Full (strict)试一下

呢四个模式全试过了都不行

csznet commented

vercel 绑定自定义域名 自定义域名dns在cloudflare 使用cname指向vercel 流程有没有问题呢,如果流程没错还是有这样的问题,稍晚一点我在项目readme中留一个联系方式,你联系我帮你处理。

域名是托管在cf的,使用cname-china.vercel-dns.com,76.76.21.21,都试过了,流程有没有问题,只要一开云朵就显示源码,关了就正常,SSL四个模式都试过没用。
不过这样也问题不大,vercel的cname-china.vercel-dns.com国内优化的还不错,就是不能用cf的缓存了

csznet commented

联系tg @tgstate123,方便的话帮你看看

联系tg @tgstate123,方便的话帮你看看
大佬
刚搜了下,是个群组,不确定刚加了

csznet commented

bot token或者channel配置错了

@csznet 老哥 CF配置这一块 方便添加点详细内容吗 第一次配置看不太懂... https://www.csz.net/proj/tgstate/ 图片

ssl选择static full,其他的设置你可以看到左侧的菜单位置,晚点我详细完善一下。

molezz commented

bot token或者channel配置错了

@csznet 谢谢老哥,检查了一下 是channel少了个@

一开始也漏了@, 这下可以啦!