美文网首页
常见问题随笔(1)

常见问题随笔(1)

作者: 小葵饭_七安 | 来源:发表于2019-08-29 17:44 被阅读0次

1、常见浏览器兼容问题

参考:https://blog.csdn.net/weixin_38536027/article/details/79375411

2、vue 导航守卫

参考:https://www.jianshu.com/p/34f4171cfd2c

https://www.jianshu.com/p/f920b0e994dc

3、ES6比ES5有什么转变

ECMAScript是JavaScript语言的国际标准,JavaScript是ECMAScript的实现。

它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。

参考:https://www.cnblogs.com/tugenhua0707/p/6750498.html

4、解决跨域的方法

【1】设置document.domain解决无法读取非同源网页的 Cookie问题

因为浏览器是通过document.domain属性来检查两个页面是否同源,因此只要通过设置相同的document.domain,两个页面就可以共享Cookie

// 两个页面都设置

document.domain = 'test.com';

【2】跨文档通信 API:window.postMessage()

调用postMessage方法实现父窗口http://test1.com向子窗口http://test2.com发消息(子窗口同样可以通过该方法发送消息给父窗口)

// 父窗口打开一个子窗口

var openWindow = window.open('http://test2.com', 'title');

// 父窗口向子窗口发消息(第一个参数代表发送的内容,第二个参数代表接收消息窗口的url)

openWindow.postMessage('Nice to meet you!', 'http://test2.com');

调用message事件,监听对方发送的消息

// 监听 message 消息

window.addEventListener('message', function (e) {

  console.log(e.source); // e.source 发送消息的窗口

  console.log(e.origin); // e.origin 消息发向的网址

  console.log(e.data);  // e.data  发送的消息

},false);

【3】JSONP

JSONP 是服务器与客户端跨源通信的常用方法。最大特点就是简单适用,兼容性好(兼容低版本IE),缺点是只支持get请求,不支持post请求。

核心思想:网页通过添加一个<script>元素,向服务器请求 JSON 数据,服务器收到请求后,将数据放在一个指定名字的回调函数的参数位置传回来。

<script src="http://test.com/data.php?callback=dosomething"></script>

// 向服务器test.com发出请求,该请求的查询字符串有一个callback参数,用来指定回调函数的名字

// 处理服务器返回回调函数的数据

<script type="text/javascript">

    function dosomething(data){

        //处理获得的数据

    }

</script>

【4】CORS

CORS 是跨域资源分享(Cross-Origin Resource Sharing)的缩写。它是 W3C 标准,属于跨源 AJAX 请求的根本解决方法。

1.前端代码(需要判断浏览器是否支持情况)

function createCORSRequest(method, url) {

  var xhr = new XMLHttpRequest();

  if ("withCredentials" in xhr) {

    // 此时即支持CORS的情况

    // 检查XMLHttpRequest对象是否有“withCredentials”属性

    // “withCredentials”仅存在于XMLHTTPRequest2对象里

    xhr.open(method, url, true);

  } else if (typeof!= "undefined") {

    // 否则检查是否支持XDomainRequest,IE8和IE9支持

    // XDomainRequest仅存在于IE中,是IE用于支持CORS请求的方式

    xhr = new XDomainRequest();

    xhr.open(method, url);

  } else {

    // 否则,浏览器不支持CORS

    xhr = null;

  }

  return xhr;

}

var xhr = createCORSRequest('GET', url);

if (!xhr) {

  throw new Error('CORS not supported');

}

2.服务器

服务器端对于CORS的支持,主要是通过设置Access-Control-Allow-Origin来进行的。如果浏览器检测到相应的设置,就可以允许Ajax进行跨域的访问。我们主要介绍Apache和PHP里的设置方法

Apache需要使用mod_headers模块来激活HTTP头的设置,它默认是激活的。你只需要在Apache配置文件的<Directory>, <Location>, <Files>或<VirtualHost>的配置里加入以下内容即可

Header set Access-Control-Allow-Origin *

PHP使用如下代码设置即可

<?php

header("Access-Control-Allow-Origin:*");

5、怎样把移动端的项目弄成一个APP

参考:https://www.cnblogs.com/taohuaya/p/10263519.html?tdsourcetag=s_pcqq_aiomsg

相关文章

网友评论

      本文标题:常见问题随笔(1)

      本文链接:https://www.haomeiwen.com/subject/vkabectx.html