瀏覽器同步與靜態.html文件 - 正則表達式幫助需要

我有靜態html文件，其中有鏈接像「/約」。對於開發，我使用gulp和browsersync，並希望像「/ about」這樣的鏈接在內部重定向到「/about.html」。瀏覽器同步與靜態.html文件 - 正則表達式幫助需要

我試圖添加使用modRewrite作爲中間件瀏覽器同步並定義一個正則表達式，以便所有沒有文件結尾和尾部斜線或無尾部斜槓的URL都被重定向到$ 1。但我無法得到它的工作。

這條規則的工作，但我需要把它定義爲每個頁面：

^(.+about)\/?$ $1.html [L]

然後我試圖定義喜歡（當文件沒有文件結束，其重定向到HTML中的規則，但這不起作用：

(!\.html|\.js|\.css|\.png$)\/?$ $1.html [L]

來源

2016-05-12 geierwally

讓我們瞭解您到目前爲止試過。 –

我加我迄今爲止嘗試過... – geierwally

嘗試['^（（？：？！？（\（?: HTML | JS | CSS | PNG）\/$））*）$ $ 1.HTML [L]']（https://regex101.com/r/fE9sR9/1） –

我現在想出了這兩個適用於我的正則表達式。這些正則表達式並沒有考慮到所有可能的url ...我使用modRewrite使用\ w有問題。但它適用於我現在，我會糾正它，如果我需要它：

'^/$ /index.html [L]', 
'^(\/?(?!\.(?:html|js|css|png|jpg|svg)$)[a-z-]* (?:\/+[a-z-]+)*)\/?$ $1.html [L]'

來源

2016-05-23 15:08:37 geierwally

在一個完全不同的方向，我公司開發的東西，而回了類似的目的，使用一些非常簡單的Javascript/jQuery代碼做內部URL的動態修改

。

您可以將Javascript放在一個靜態的.js文件中，然後從CDN中包含jQuery幷包含來自公共目錄的Javascript代碼。假設您調用文件「鏈接rewriter.js」，你會使用它，像這樣從.html文件：

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script> 
<script type="text/javascript" src="/public/javascript/link-rewriter.js"></script>

的鏈接重寫代碼如下所示：

jQuery(document).ready(function() { 
    var parser = document.createElement('a'); 
    parser.href = '/'; 

    var domain = parser.protocol + '//' + parser.host; 
    var regexp = new RegExp('^' + escapeRegExp(domain), 'i'); 

    $('a[href^="http://"],a[href^="https://"],a[href^="//"]]').each(function(index, link) { 
     var href = link['href'].replace(regexp, ''); 

     if ((!/^\//.test(href)) && (!/\.html$/i.test(href)) { 
      link['href'] = link['href'] + '.html'; 
     } 
    }); 
});

爲了定義域，這個代碼首先創建一個原型鏈接（錨點）元素，用於查詢頁面的協議和主機。

然後，每次HTTP，HTTPS，和相對的本地鏈接元素進行處理，以查看是否需要被重寫。處理代碼首先將網頁的網域去掉，然後留下針對另一個網域（或協議）或該網域的鏈接。這個域的鏈接被進一步處理，以查看哪些鏈接缺少.html擴展名，並且那些自動添加.html擴展名的鏈接。

有利的一面，以這種方式：

簡單地添加到標籤頁將就地升級的鏈接
是極快的，因此用戶不會注意到它的發生，甚至上千（ !!）的頁面上的鏈接
只爲同一個域中的鏈接被修改，甚至是特定的鏈接羣體可能成爲攻擊目標

這種方法的缺點：

的用戶必須在他們的瀏覽器的JavaScript（真的，誰不，這些天？）
這是代碼，因此它可能最終需要維護或增強功能

來源

2016-05-13 07:10:01

感謝您的方法，萬一我成爲modRewrite問題，我將切換回您的解決方案。 – geierwally

找到一個解決方案，而不需要modRewrite。 serve-static包可以爲你做所有的辛苦工作。爲您提供指定擴展的選項，以查找何時找不到請求的文件。

var serveStatic = require('serve-static') 

gulp.task('server', function() { 
    return browserSync.init({ 
     server: { 
      baseDir: '/', 
      middleware: [ 
       serveStatic('/', { extensions: ['html'] }) 
      ] 
     } 
    }); 
});

來源

2016-05-27 20:43:01 Schots

我試過這個，它只適用於像http：// localhost：9000 /這樣的路徑。 http：// localhost：9000/work /不起作用。這應該工作嗎？ – geierwally

[link]（localhost：9000/work）路徑確實是有效的。所以[link]（localhost：9000/work）在我的例子中查找'/ work.html' – Schots

瀏覽器同步與靜態.html文件 - 正則表達式幫助需要

回答

相關問題