json-server,跨域

打印 上一主题 下一主题

主题 777|帖子 777|积分 2331

启动json-serer

json-server --watch db.json
注意: db.json为json文件的名称,你本身的文件名叫什么,就启动对应的文件就可以了 启动json-server的时候,必须在你db.json所在的文件夹下进行启动
如许服务器就可以启动乐成了,可以通过设置db.json文件,访问服务器内里的数据 访问地址:127.0.0.1:3300/student
使用json-sever实现增编削查

1.get 查找
http://localhost:3000/student(资源名)/id
2.post 添加 
http://localhost:3000/student   不必要id ,会主动添加 
3.put  修改    使用put修改会覆盖之前原有的数据,仅有修改后的数据   
              patch 部分修改    只会修改你要修改的数据,原有数据不变                                                   4.delete 删除     只必要 通报要删除的端标语 
        http://localhost:3000/student(资源名)/id  
跨域 

协议(http,https),端标语,域名只要有一个不一样就是跨域 
http 默认端标语80  https默认端标语443 
    jsonp跨域 

前端发送哀求 后端配合回调函数 好处:

  • javascript 兼容性比较好
  • 不必要服务器支持,直接在本地运行
缺点:

  • 它只支持GET哀求而不支持POST等其它范例的HTTP哀求
  • 它只支持跨域HTTP哀求这种情况,不能解决不同域的两个页面之间怎样进行JavaScript调用的题目。
  • jsonp在调用失败的时候不会返回各种HTTP状态码。
  • 安全性。万一假如提供jsonp的服务存在页面注入漏洞,即它返回的javascript的内容被人控制的。那么结果是什么?所有调用这个 jsonp的网站都会存在漏洞。于是无法把伤害控制在一个域名下…所以在使用jsonp的时候必须要包管使用的jsonp服务必须是安全可信的
 jsonp哀求

前端
  1. <input type="text"> <button>点击</button>
  2. var btn = document.querySelector('button');
  3. btn.onclick = function(){
  4.     var val = document.querySelector('input').value;
  5.     // 1. 创建script标签
  6.     var scriptM = document.createElement('script');
  7.     // 2. 添加src属性
  8.     scriptM.src = `http://suggest.taobao.com/sug?code=utf-8&q=${val}&callback=success`;
  9.     // 3. 添加到body标签中
  10.     document.body.appendChild(scriptM);
  11. }
  12. function success(data){
  13.     console.log(data.result
  14.     );
  15. }
复制代码
后端
  1. $val = $_GET['cb'];
  2. $data = '{
  3.     "code":1,
  4.     "msg":"ok",
  5.     "data":[{
  6.         "uname":"jack",
  7.         "class":"java"
  8.     },{
  9.         "uname":"rose",
  10.         "class":"ui"
  11.     },{
  12.         "uname":"bob",
  13.         "class":"鸿蒙"
  14.     },{
  15.         "uname":"张三",
  16.         "class":"java"
  17.     }]
  18. }';
  19. echo $val."(".$data.")"; // abc();
复制代码
             


补充url 对象


  • URL的编码/解码方式
        JavaScript 提供四个 URL 的编码/解码方法。


  • encodeURI()
  • encodeURIComponent()
  • decodeURI()
  • decodeURIComponent()
1.encodeURI()方法用于转码整个 URL。它的参数是一个字符串,代表整个 URL。它会将元字符和语义字符之外的字符,都进行转义
  1. encodeURI('http://www.example.com/q=春节')
  2. // "http://www.example.com/q=%E6%98%A5%E8%8A%82"
复制代码
2。encodeURIComponent()
encodeURIComponent()方法用于转码 URL 的组成部分,会转码除了语义字符之外的所有字符,即元字符也会被转码。所以,它不能用于转码整个 URL。它接受一个参数,就是 URL 的片段
  1. encodeURIComponent('春节')
  2. // "%E6%98%A5%E8%8A%82"
  3. encodeURIComponent('http://www.example.com/q=春节')
  4. // "http%3A%2F%2Fwww.example.com%2Fq%3D%E6%98%A5%E8%8A%82" 1234
复制代码
3.decodeURI()
decodeURI()方法用于整个 URL 的解码。它是encodeURI()方法的逆运算。它接受一个参数,就是转码后的 URL。
  1. decodeURI('http://www.example.com/q=%E6%98%A5%E8%8A%82')
  2. // "http://www.example.com/q=春节" 12
复制代码
4。decodeURIComponent()
decodeURIComponent()用于URL 片段的解码。它是encodeURIComponent()方法的逆运算。它接受一个参数,就是转码后的 URL 片段
  1. decodeURIComponent('%E6%98%A5%E8%8A%82') // "春节"
复制代码


免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

雁过留声

金牌会员
这个人很懒什么都没写!

标签云

快速回复 返回顶部 返回列表