欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  后端开发

javascript - 跳转适配和代码适配分别用什么技术实现?

程序员文章站 2022-06-04 21:02:07
...
在移动端适配PC端网站技术上,官方提供了三种适配方案:响应式设计、动态提供内容(代码适配)和单独的网址(跳转适配)。但是身为前端的我只知道响应式设计,不知道另外两中的技术实现。

概念来自:
google、百度

我现在认为
跳转适配主要是使用JS判断用户使用的浏览器是移动端还是PC端。然后跳转到指定网页,例如baidu.com/index.html跳转到m.baidu.com/index.html
SEO的话提交给搜索引擎这两个网页的关系。

代码适配是获取HTTP请求头中浏览器的内容判,使用PHP(或其他后端语言)判断设备从而返回针对不同设备的内容,URL不改变。

不知道自己这样想对不对,求指正和补充,谢谢

回复内容:

在移动端适配PC端网站技术上,官方提供了三种适配方案:响应式设计、动态提供内容(代码适配)和单独的网址(跳转适配)。但是身为前端的我只知道响应式设计,不知道另外两中的技术实现。

概念来自:
google、百度

我现在认为
跳转适配主要是使用JS判断用户使用的浏览器是移动端还是PC端。然后跳转到指定网页,例如baidu.com/index.html跳转到m.baidu.com/index.html
SEO的话提交给搜索引擎这两个网页的关系。

代码适配是获取HTTP请求头中浏览器的内容判,使用PHP(或其他后端语言)判断设备从而返回针对不同设备的内容,URL不改变。

不知道自己这样想对不对,求指正和补充,谢谢

如果要根据浏览器的UA来确定访问的是PC端还是Mobile端

在nginx中做重定向应该会比较好,这样对前端代码和后端服务器代码都没有侵入性。

这应该是题主说的跳转适配吧。

刚好我不知道第一种 响应式设计 怎么做的,但是知道后两种:

动态提供内容:后端代码可以检测当前请求的来源设备,网络情况,由此来决定如何渲染内容,渲染不同的模板或者不同的数据格式……

单独的网址:m.xxx.com 要么是单独的应用,比如手机版WAP的淘宝,或者H5.XXX.COM,这样的,或者是其实就是第二种的变种,只不过是路由不同而已,一般前者适应于大型的应用,如淘宝,后者则比较简单。

现在我也差不多知道了我不知道的第一种了,谢谢你。

但是我有一个疑问:“响应式设计”无形之中会增加一些成本吧,原本单一的网页,响应式设计后体积会变大吧?