阿里云前端一面凉经

#我的实习求职记录#
3.6

1、离线发布怎么做？用户退出页面之后怎么再次发布？用户有十个离线发布请求怎么办？还包含文件图片上传怎么办？

离线发布是指用户在没有网络连接的情况下，仍然能够执行发布操作，并在恢复网络连接后将发布请求发送到服务器。实现离线发布的一般步骤如下：

1. 本地存储离线发布请求：

   • 当用户执行发布操作时，将发布请求保存到本地存储（例如LocalStorage、IndexedDB等）中，以便在没有网络连接时能够重新发送请求。

2. 检测网络连接状态：

   • 使用浏览器的navigator.onLine属性来检测网络连接状态，判断用户当前是否处于在线状态。

3. 监听网络连接状态变化：

   • 使用window.addEventListener('online', callback)和window.addEventListener('offline', callback)来监听网络连接状态的变化。
   • 当网络连接恢复时，执行回调函数来处理本地存储中的离线发布请求。

4. 处理离线发布请求：

   • 当网络连接恢复时，从本地存储中读取离线发布请求，并将请求发送到服务器。
   • 如果请求成功，可以将本地存储中对应的离线发布请求移除，表示请求已成功处理。
   • 如果请求失败，可以保留请求在本地存储中，以便后续重试。

5. 处理多个离线发布请求：

   • 如果用户有多个离线发布请求，在恢复网络连接时，逐个处理这些请求。
   • 可以使用队列或循环来依次发送这些请求，确保每个请求都能够得到处理。

6. 文件图片上传的处理：

   • 对于需要上传文件或图片的离线发布请求，可以将文件或图片保存到本地，并将文件路径或图片数据保存到请求中。
   • 在恢复网络连接后，将文件路径或图片数据上传到服务器，并将结果保存到本地或数据库中。

综上所述，实现离线发布功能需要利用浏览器提供的网络状态API来检测和监听网络连接状态，以及使用本地存储来保存离线发布请求。对于涉及到文件或图片上传的请求，需要将文件或图片保存到本地，并在恢复网络连接后进行上传处理。

2、权限验证的过程，与微信的交互过程、token的过期时长怎么确定？

权限验证是指在用户访问某个资源或执行某个操作时，系统需要验证用户是否具有相应的权限。其过程通常如下：

1. 用户请求资源或操作： 用户发起请求，要求访问某个资源或执行某个操作，比如访问一个网页、发送一个API请求等。

2. 系统验证权限： 系统接收到用户的请求后，会进行权限验证，检查用户是否具有执行该请求所需的权限。

   • 如果用户拥有足够的权限，系统将继续执行请求，并返回相应的资源或执行结果。
   • 如果用户权限不足，系统将返回相应的错误信息或重定向到登录页面等操作，提示用户进行登录或提升权限。

微信的交互过程通常涉及OAuth2.0协议，包括用户授权、获取access_token等步骤：

1. 用户授权： 用户在微信客户端登录，并授权给第三方应用访问其微信信息的权限。

2. 获取code： 微信返回一个临时的授权码（code）给第三方应用。

3. 通过code获取access_token： 第三方应用将code发送给微信服务器，并通过code获取access_token，access_token用于后续对微信资源的访问。

4. 访问微信资源： 第三方应用使用access_token来访问微信提供的API，获取用户信息、发送消息等操作。

Token的过期时长通常由系统管理员或开发者根据实际需求来确定，一般会根据安全性和用户体验来权衡考虑。过短的过期时长可能导致用户频繁需要重新登录，而过长的时长可能增加了安全风险。一般来说，access_token的过期时长通常为几个小时到几天不等，具体取决于应用的安全性需求和用户的使用习惯。accessToken的过期时间通常会在生成token时与服务器时间相对比较，再加上一个设定的时间差值作为有效期，一旦超过了这个有效期，token将会失效。

3、做了那些性能优化

`4、uniapp多端实现原理

答：uniapp.dcloud.net.cn/tutorial/

Uni-app 是一个基于 Vue.js 的跨平台应用开发框架，它可以将同一套代码编译成不同平台的应用，包括微信小程序、App（iOS、Android）、H5 等。Uni-app 多端实现的原理主要包括以下几个方面：

1. 统一的代码结构：

   • 开发者可以使用 Vue.js 的语法进行开发，编写统一的代码逻辑和组件。
   • Uni-app 提供了一套跨端的 API，开发者可以使用这些 API 来实现不同平台的特定功能。

2. 平台适配层：

   • Uni-app 在编译时会根据目标平台生成相应的适配层代码。
   • 适配层会将开发者编写的统一代码转换成特定平台的代码，包括页面结构、样式、事件绑定等。

3. 运行时环境：

   • Uni-app 提供了针对不同平台的运行时环境，如小程序运行时、App 运行时等。
   • 运行时环境负责加载适配层生成的代码，并在相应平台上执行，实现应用的运行。

4. 构建工具：

   • Uni-app 提供了一套构建工具，用于将开发者编写的代码编译成目标平台的可执行代码。
   • 构建工具会根据配置文件和目标平台的要求，生成相应平台的应用包。

5. 编译优化：

   • Uni-app 的编译过程会进行一些优化，包括代码压缩、资源合并、懒加载等，以提高应用的性能和加载速度。

总的来说，Uni-app 多端实现的原理是通过统一的代码结构、平台适配层、运行时环境和构建工具，将开发者编写的统一代码转换成不同平台的可执行代码，从而实现同一套代码在不同平台上的运行和展示。

5、http缓存、http1.0，2.0区别，http状态码

HTTP缓存

HTTP缓存是一种在客户端和服务器之间缓存资源的机制，以减少重复传输和提高网站性能。主要包括以下几种缓存策略：

1. 浏览器缓存：

   • 浏览器缓存是将下载的资源保存在客户端浏览器中，以便下次请求相同资源时可以直接从本地获取，而不需要重新下载。

2. 代理服务器缓存：

   • 代理服务器缓存是将资源保存在代理服务器中，以便多个客户端共享同一份缓存，减少服务器负载和提高响应速度。

3. CDN缓存：

   • CDN（内容分发网络）是一种将资源分发到全球各地的服务器上，以便用户可以从距离更近的服务器获取资源，从而减少网络延迟和提高下载速度。

HTTP/1.0与HTTP/2.0区别

1. 连接复用：

   • HTTP/1.0每次请求都需要建立和关闭TCP连接，而HTTP/2.0支持多路复用，可以在同一个TCP连接上同时发送多个请求和响应，从而减少连接建立和关闭的开销。

2. 头部压缩：

   • HTTP/2.0使用HPACK算法对请求和响应头部进行压缩，减少了传输的数据量，提高了网络性能。

3. 服务器推送：

   • HTTP/2.0支持服务器推送，可以在客户端请求之前将相关资源推送给客户端，从而加快页面加载速度。

4. 二进制传输：

   • HTTP/2.0采用二进制格式传输数据，而HTTP/1.0使用文本格式，二进制格式更加高效，可以更快地解析和传输数据。

HTTP状态码

HTTP状态码是服务器对客户端请求的响应结果的一种标识，常见的状态码包括：

• 1xx（信息性状态码）： 表示服务器接收到请求，正在处理。

• 2xx（成功状态码）： 表示请求已成功被服务器接收、理解、并接受。

• 3xx（重定向状态码）： 表示需要客户端采取进一步的操作才能完成请求。

• 4xx（客户端错误状态码）： 表示客户端发送的请求有错误，例如请求资源不存在、未授权访问等。

• 5xx（服务器错误状态码）： 表示服务器在处理请求时发生了错误，例如服务器崩溃、超时等。

常见的HTTP状态码包括200（OK）、404（Not Found）、500（Internal Server Error）等，每个状态码都有特定的含义，用于指示请求的处理结果。

6、怎么防止别人盗取用户图片、图片怎么加水印？

防止别人盗取用户图片和为图片添加水印是常见的保护用户隐私和版权的方法。以下是防止盗取图片和图片加水印的一些方法：

防止盗取图片：

1. 使用防盗链策略：

   • 通过服务器配置，限制图片只能在特定的网站或域名上加载，防止其他网站直接引用图片链接。

2. 设置Referer白名单：

   • 服务器可以设置Referer白名单，只允许特定来源的网站访问图片，拒绝其他非法来源的访问。

3. 加密图片链接：

   • 对图片链接进行加密处理，只有在特定条件下才能解密获取图片链接，增加了盗取图片的难度。

4. 添加水印：

   • 在图片上添加水印可以标识图片的版权信息，一旦被盗用，便可以通过水印追溯图片来源。

图片添加水印：

1. 文本水印：

   • 在图片上添加文本水印，包括作者信息、版权声明、时间等，通常可以通过图形处理软件或在线工具添加。

2. 图片水印：

   • 将一张透明度较低的图片叠加在原始图片上，起到标识图片版权的作用。

3. 数字签名：

   • 使用数字签名技术对图片进行加密，只有拥有私钥的用户才能解密图片，防止盗取和篡改。

4. 混合水印：

   • 将文本水印、图片水印和数字签名等多种水印技术结合使用，增加了盗取图片的难度和成本。

综上所述，防止别人盗取用户图片可以通过设置防盗链策略、加密图片链接等方法来实现，同时为图片添加水印可以标识图片的版权信息，增加盗用者的追溯难度。

7、怎么防止token被盗取，怎么防止七牛云被盗刷流量？

防止Token被盗取和防止七牛云被盗刷流量是常见的安全问题，以下是一些相应的防范措施：

防止Token被盗取：

1. 使用HTTPS协议：

   • 通过使用HTTPS协议来加密传输的数据，防止Token在传输过程中被拦截和窃取。

2. Token有效期限制：

   • 设置Token的有效期，确保Token在一段时间后自动失效，降低被盗取的风险。
   • 可以根据用户的登录状态和操作频率来动态更新Token的有效期，降低Token被盗取后的影响范围。

3. 使用Token绑定IP地址或设备：

   • 将Token绑定到用户的IP地址或设备信息上，确保Token只能在特定的IP地址或设备上使用，减少被盗取后的滥用风险。

4. 加密存储：

   • 在客户端和服务器端对Token进行加密存储，防止被恶意用户和攻击者窃取。

5. 安全传输：

   • 在客户端和服务器之间传输Token时，使用安全的传输方式和加密算法，如基于OAuth2.0的安全认证机制。

防止七牛云被盗刷流量：

1. 访问密钥管理：

   • 定期更新七牛云的访问密钥，确保只有授权的用户可以访问和使用七牛云服务。

2. 限制访问来源：

   • 在七牛云的访问策略中限制访问来源，只允许特定的IP地址或域名访问七牛云资源，防止非法请求和盗刷流量。

3. 防盗链策略：

   • 在七牛云中配置防盗链策略，限制只有特定的域名或Referer才能访问七牛云资源，防止盗链和盗刷流量。

4. 监控和报警：

   • 设置监控和报警机制，定期检查七牛云的流量使用情况，及时发现异常流量和非法请求，并采取相应的应对措施。

5. 使用CDN加速：

   • 利用七牛云提供的CDN加速服务，将静态资源分发到全球各地的节点上，减少服务器负载和防止单点攻击。

通过以上措施，可以有效地防止Token被盗取和七牛云被盗刷流量，保障系统和数据的安全性和稳定性。

8、有没有弄过自定义指令

是的，我熟悉自定义指令的概念和用法。在Vue.js中，自定义指令是一种可以直接在DOM元素上使用的特殊属性，用于添加额外的行为或操作。自定义指令可以用来操作DOM，监听事件，进行数据绑定等。以下是自定义指令的一些常见用法：

1. 全局自定义指令：
   • 可以使用Vue.directive方法来创建全局自定义指令，以便在整个应用中都可以使用该指令。

Vue.directive('custom', {
  // 指令的定义
  bind(el, binding, vnode) {
    // 在绑定元素插入到 DOM 时调用
    el.style.color = binding.value;
  }
});

2. 局部自定义指令：
   • 在组件内部的directives选项中定义局部自定义指令，只能在当前组件内部使用。

directives: {
  custom: {
    bind(el, binding, vnode) {
      // 指令的定义
      el.style.color = binding.value;
    }
  }
}

3. 钩子函数：

   • 自定义指令可以定义一系列钩子函数，如bind、inserted、update、componentUpdated和unbind等，用于在不同阶段对DOM进行操作。

4. 传值：

   • 可以通过指令的参数传值，使指令具有动态性，根据传入的值来决定指令的行为。

<!-- 使用全局指令 -->
<div v-custom="'red'">This is a custom directive</div>

<!-- 使用局部指令 -->
<div v-custom:arg="'red'">This is a custom directive</div>

5. 指令修饰符：
   • 指令修饰符可以用来扩展指令的功能，如.stop、.prevent、.once等，可以通过.来调用修饰符。

<!-- 阻止事件冒泡 -->
<a v-on:click.stop="doThis"></a>

通过自定义指令，可以实现一些特定的DOM操作和行为控制，使得Vue.js的应用更加灵活和强大。

9、专利的具体过程

第一次面试 凉凉

作者：放学路上
链接：www.nowcoder.com/feed/main/d…
来源：牛客网‘