作者BOMBGUY (Romeo)
看板Web_Design
标题[问题] api串接与跨域问题
时间Thu Nov 15 14:05:21 2018
初学前端两个月，想试试看从气象局api串接资料(JSON)来玩玩。
有金钥已经取得url，可是遇到
跨域的问题，上网找了许多解决方法，
不过似乎很多都要需要後端配合?最後找到了jsonp这个方法。
1.
创建一个script用src属性传入，但是又出错了:
Cross-Origin Read Blocking (CORB) blocked cross-origin response
(我的URL) with MIME type application/json.
这个error的意思是因为我档案格式是JSON所以不能引入吗?
2.
我试过的第二个方法是直接用jquery以jsonp的方式取得:
$.ajax({
url: api,
type: "GET",
dataType: "jsonp",
success: function (data) {
console.log(data);
},
error: function(){
alert("false")
}
});
又是出现一样的error
3.
唯一成功的方法是安装google的小套件: allow-control-allow-origin: *
并把上面的dataType改成json就能成功。但觉得有点旁门左道哈哈哈
请问版上各位高手应该怎麽解决这个问题呢?
希望能尽量以纯前端解决这个问题(小弟只会前端语言QQ)
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 111.252.155.253
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Web_Design/M.1542261929.A.A06.html
※ 编辑: BOMBGUY (111.252.155.253), 11/15/2018 14:23:44
感谢k大，找方法时有找到这篇文，但是有看没有懂，我再仔细看个清楚^ _ ^
2F：→ ssccg: 初学的话你Y先搞懂为什麽要限制cross origin存取11/15
14:51
3F：→ ssccg: 不是怎麽解决这问题，而是你不该这麽做11/15 14:52
Yes, sir!
4F：推 pm2001: 後端唯一解11/15 17:48
QAQ
※ 编辑: BOMBGUY (223.141.123.247), 11/15/2018 17:55:52
5F：推 vi000246: 我记得google已经把前端跨域的各种方式都挡死了11/15 18:16
6F：→ vi000246: 这是client端的问题 你的浏览器帮你挡的11/15 18:17
7F：推 shter: 我串火车的 ptx API 倒没碰过这种问题11/15 23:47
今天用ptx API真的畅行无阻www
8F：推 shter: 但是串接这种资料不应该用 Script src 弄进来吧11/15 23:53
9F：→ shter: 用var xhr = new XMLHttpRequest()再 xhr.open('GET', url)11/15 23:55
10F：→ taitzyhwan: 後端要设定允许跨域的网域11/16 00:24
11F：→ inxbone: 同五楼所说安全性问题 浏览器挡掉了 唯一解就是後端回传11/16 12:29
12F：→ inxbone: 的表头宣告允许 如果你只是练习用你原本的插件就够了11/16 12:29
感谢各位前辈回覆，已选择使用插件。
※ 编辑: BOMBGUY (42.76.148.168), 11/16/2018 17:48:39
※ 编辑: BOMBGUY (42.76.148.168), 11/16/2018 17:49:22